<template>
	<view class="dialog-container"v-if="display">
		<view class="dialog-background" @click="clickToHide"></view><!-- 遮罩 -->
		<view class="dialog-main"><!-- 主窗体 -->
			<view class="dialog-title">{{title}}</view>
				<slot>1111</slot>
				<!-- image class="login-shell" src="../../static/icon.png" mode="" ></image>
				<br>
				<text style="font-size: 30px;">welcome!</text>
				<br>
				<text style="color: skyblue;">没有账号？请注册</text> -->
			<text class="dialog-btn"@click="clickConfirm">{{confirmText}}</text>
		</view>//主窗口
	</view>
</template>

<script>
	export default {
		name:"dialog-shell",
		props:{
			title:{
				type:String,
				require:true,
				validator:(val)=>{
					return val.length >0
				}
			},
			confirmText:{
				type: String,
				default:"确定",
				required:false,
				validator:(val)=>{
					return val.length >0
				}
			}
		},
		data() {
			return {
				display:false
			};
		},
		methods:{
			clickToHide(){
				this.display=false
			},
			show(){
				this.display=true
			},
			clickConfirm(){
				this.$emit("confirm")
				this.display=false
			}
		}
	}
</script>

<style>
@import url("dialog-shell.css");
</style>